<!--
 * @Author: qwlbwm 18370818801qwl./
 * @Date: 2023-09-06 13:36:58
 * @LastEditors: whereamazinghappen 306702547@qq.com
 * @LastEditTime: 2023-09-23 15:56:13
 * @FilePath: \checc-business-module-web-kgpt-dev\src\views\examineManage\components\editAddStandardIndex.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <!-- 通用的评分管理（包括中交和中咨） -->
  <div>
    <el-dialog
      v-model="dialogVisible"
      width="1100px"
      :before-close="beforeClose"
      title="模拟分配"
    >
      <div class="examine-dialog-content" v-if="currentScoreCompose">
        <el-tabs v-model="tabActive" @tab-click="tabClick">
          <el-tab-pane
            :label="item.composeItem_text"
            v-for="item in scoreComposeArr"
            :key="item.id"
            :name="item.id"
          ></el-tab-pane>
        </el-tabs>
        <div v-if="currentScoreCompose.composeItem == 'A0001'">
          {{ currentScoreCompose.beforeYearText || "" }}
        </div>
        <div
          v-else-if="
            currentScoreCompose.composeItem == 'A0003' ||
            currentScoreCompose.composeItem == 'A1000'
          "
        >
          计划贡献分数：
          <el-input
            style="width: 200px"
            v-if="currentScoreCompose.degradeList.length"
            v-model="currentScoreCompose.degradeList[0].selfScore"
            type="number"
          />
        </div>
        <div v-else>
          <el-table
            :data="currentScoreCompose.degradeList"
            style="width: 100%"
            row-key="number"
            height="400px"
            border
            @selection-change="selectionChange"
            :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
          >
            <el-table-column type="selection" align="center" width="55" />
            <el-table-column prop="number" align="left" width="120" label="编号" />
            <el-table-column prop="name" align="center" label="配置项" />
            <el-table-column prop="setType_text" align="center" label="类型" />
            <el-table-column prop="standardFactor" align="center" label="标准系数">
              <template #default="scope">
                <span v-if="scope.row.setType === '2'">{{
                  scope.row.standardFactor
                }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="joinFactor" align="center" label="参与方式系数">
              <template #default="scope">
                <span v-if="scope.row.setType === '2' && scope.row.joinValue">
                  {{ scope.row.joinValue_text }}({{ scope.row.joinFactor }})
                </span>
              </template>
            </el-table-column>
            <el-table-column prop="rankFactor" align="center" label="排名系数">
              <template #default="scope">
                <span v-if="scope.row.setType === '2'">{{
                  filterRankFactor(scope.row)
                }}</span>
                <!-- {{ scope.row.rankFactor }}{{ scope.row.rankFactor }} -->
              </template>
            </el-table-column>
            <el-table-column prop="setIntro" align="center" label="配置项说明" />
            <el-table-column
              prop="rankFactor"
              align="center"
              width="130px"
              label="计划完成数量"
            >
              <template #default="scope">
                <el-input
                  v-model="scope.row.planCompleteNum"
                  type="number"
                  style="width: 100px"
                  v-if="scope.row.setType == '2'"
                />
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="cancel">关闭</el-button>
          <el-button type="primary" @click="confirm">保存</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>

<script lang="ts">
import { computed, defineComponent, reactive, watch, toRefs, ref } from "vue";
import { dataDictionary } from "@/api/dict";
import * as api from "../../../api/zJexaminePlan";
import { ElMessage } from "element-plus";
interface ItemSet {
  id: string;
  [propName: string]: any;
}
export default defineComponent({
  emits: {
    "update:visible": null,
  },
  props: {
    visible: {
      type: Boolean,
      default: false,
      required: true, // 必传项
    },
    standardType: {
      type: String, //1中交还是2中资
      default: "1",
    },
    handleRow: {
      //处理的指标数据
      type: Object,
    },
    pageDisabled: {
      //页面是否只可以看不能操作
      type: Boolean,
      default: false,
    },
  },
  setup(props, { emit }) {
    const dialogVisible = computed(() => {
      return props.visible;
    });
    const selectedRows = ref<Array<ItemSet>>([]);
    const dict_datas = reactive({
      dict_ranklist: [],
      dict_joinMethods: [],
    });
    const state = reactive<any>({
      //整体数据带dict全是字典查询
      scoreComposeArr: [],
      currentScoreCompose: null, //当前tab选中的组成详情
      tabActive: "",
      handleItemRow: null, //处理的配置项数据
      table_list: [],
      dontkowid: "",
    });
    const beforeClose = () => {
      cancel();
    };

    const selectionChange = (arr) => {
      //选中
      selectedRows.value = arr;
    };
    const tabClick = (TabsPaneContext) => {
      state.currentScoreCompose = state.scoreComposeArr[TabsPaneContext.index];
      console.log(state.currentScoreCompose);
      //   state.tabActive = TabsPaneContext.props.name
    };
    const cancel = () => {
      emit("update:visible", false);
    };
    const confirm = () => {
      //确定新增或修改

      api
        .simulateDegradeSaveRequest({
          id: state.dontkowid,
          itemList: state.scoreComposeArr,
        })
        .then((res) => {
          if (res.data.code == 200) {
            ElMessage.success("已保存");
            cancel();
          }
        });
    };
    const filterRankFactor = (row) => {
      let str = "";
      if (row.rankValue) {
        let a: any = dict_datas.dict_ranklist.find(
          (item: any) => item.itemValue === row.rankValue
        );
        str += a.itemText + `(${row.rankFactor})`;
      }
      return str;
    };
    // const filterJoinMethod = (mt) => {
    //   let str = ''
    //   console.log('怎么会有东西呢',mt);
    //   if (mt) {
    //     console.log('怎么会有东西呢2',mt);
    //     for (const key in mt) {
    //       let a: any = dict_datas.dict_joinMethods.find((item: any) => item.itemValue === key)
    //       str += (a.itemText + `(${mt[key]})`)
    //     }
    //   }
    //   return str
    // }
    watch(
      () => props.visible,
      (newval) => {
        if (newval) {
          getScoreDetail();
        }
      }
    );
    const refresh = () => {
      getScoreDetail(state.tabActive);
    };
    const getScoreDetail = (active?) => {
      //获取评分管理详情列表
      api
        .simulateDegradeRequest({
          id: props.handleRow?.id, //1-中交标准指标、2-中咨标准指标
        })
        .then((res) => {
          state.scoreComposeArr = res.data.data.itemList;
          state.dontkowid = res.data.data.id;
          let list = res.data.data.itemList;
          if (!list.length) {
            ElMessage.warning("该指标无数据无法进行模拟分配");
            return;
          }
          if (active) {
            //如果已经在其他tab了就自动切换
            state.currentScoreCompose = list.find((item) => item.id === active);
          } else {
            state.currentScoreCompose = list[0];
          }
          state.tabActive = state.currentScoreCompose.id;
        });
    };
    const getDictDatas = () => {
      let dictIds = ["KHGL_COMPOSE_SET_RANK_CODE"];
      dataDictionary(dictIds).then((res) => {
        let response = res.data.data;
        dict_datas.dict_ranklist = response.KHGL_COMPOSE_SET_RANK_CODE;
        // dict_datas.dict_joinMethods = response.KHGL_COMPOSE_SET_JOIN_METHOD_CODE
      });
    };
    getDictDatas();
    return {
      ...toRefs(state),
      dict_datas,
      dialogVisible,
      beforeClose,
      filterRankFactor,
      refresh,
      selectionChange,
      tabClick,
      cancel,
      confirm,
    };
  },
});
</script>
<style lang="scss" scoped>
.examine-dialog-content {
  padding: 20px;
}
:deep(.el-dialog__header) {
  border-bottom: 1px solid #f1eded;
}
</style>
